<template>
    <div>
        <div id="slider" class="mui-slider">
				<div id="sliderSegmentedControl" class="mui-scroll-wrapper mui-slider-indicator mui-segmented-control mui-segmented-control-inverted">
					<div class="mui-scroll">
		<a :class="['mui-control-item',item.id==0?' mui-active':'']" v-for="item in dataList" :key="item.id"><!-- 绑定的属性里面可以进行三元表达式 -->
							{{item.title}}
		</a>
					</div>
				</div>

			</div>
    </div>
</template>
<script>
 import mui from '../../lib/mui/js/mui.js'
export default {
    data(){
        return{
			dataList:''
        }
	},
	created() {
		this.getAllList()
	},
    mounted() {
       mui('.mui-scroll-wrapper').scroll({
	deceleration: 0.0005 //flick 减速系数，系数越大，滚动速度越慢，滚动距离越小，默认值0.0006
});  
},
    methods:{
     getAllList(){
		 this.$http.get('photoList.json').then(resolve=>{
			 if(resolve.body.status == 0){
				 this.dataList = resolve.body.message;
				console.log(this.dataList)
			 }
		 })
	 }
    }
}
</script>
<style lang="scss" scoped>
 *{touch-action:pan-y;} 
</style>
